import React, {PureComponent} from 'react'
import Device from './device-detail'
import Bar from './bar'
import Discrete from './discrete'
import {connect} from 'react-redux'
import {millToString} from '../../util/util'

class DeviceInfo extends PureComponent {

    render() {
        const {data} = this.props
        const {logs = [], currentSingleBoard = {}, data: param = {}} = data

        const pieData = {
            title: '设备今日运行状况',
            option: {},
            data: [{
                value: 100,
                name: '正常'
            }, {
                value: 0,
                name: '未完成'
            }, {
                value: 0,
                name: '故障'
            }]
        }

        const boardData = {
            '程序名': currentSingleBoard.programName,
            '任务令': currentSingleBoard.taskId,
            '编码': currentSingleBoard.encode,
            '测试时间': millToString(currentSingleBoard.processDate),
        }

        const volume = param.VolumeList || []
        const area = param.AreaList || []
        const point = param.point || []
        const height = param.HeightList || []
        const volData = {
            title: '体积分布图',
            xAxisData: volume.map(v => v.x),
            yAxisData: volume.map(v => v.y)

        }
        const areaData = {
            title: '面积分布图',
            xAxisData: area.map(v => v.x),
            yAxisData: area.map(v => v.y)

        }
        const heightData = {
            title: '高度分布图',
            xAxisData: height.map(v => v.x),
            yAxisData: height.map(v => v.y)

        }

        const xyData = {
            title: 'XY偏移量分布图',
            data: point

        }
        return (
            <Device src="../images/business/SPI.png" data={data} currentSingleBoard={boardData} pieData={pieData}>
                <div className="device-res">
                    <p>单板条码：{data.SingleboardBarcode}</p>
                    <p>测试结果：pass</p>
                    <div className="device-res-col6">
                        <Bar data={volData}/>
                    </div>
                    <div className="device-res-col6">
                        <Bar data={areaData}/>
                    </div>
                    <div className="device-res-col6">
                        <Bar data={heightData}/>
                    </div>
                    <div className="device-res-col6">
                        <Discrete data={xyData}/>
                    </div>
                </div>
            </Device>
        )
    }

}
function mapStoreToProps({deviceMetrics}) {
    return {
        data: deviceMetrics.get('spi').toJS()
    }
}

export default connect(mapStoreToProps)(DeviceInfo)

